
flex-cnter()
  display: flex
  justify-content: center
  align-items: center

full()
  wh(100%, 100%)

wh($width, $height)
  width: $width
  height: $height

maxW($width)
  max-width: $width

maxH($height)
  max-height: $height

maxWH($width, $height)
  max-width: $width
  max-height: $height

// 全屏
full-cover()
  position: absolute
  top: 0
  left: 0
  right: 0
  bottom: 0

//定位上下左右居中
pos-center()
  position: absolute
  top: 50%
  left: 50%
  transform: translate(-50%, -50%)

bf($left, $top, $width, $height, $size, $color, $arc)
  position: relative
  &:before
    content: ''
    position: absolute
    left: $left
    top: $top
    width: $width
    height: $height
    border: $size solid $color
    box-sizing: border-box
    border-radius: $arc
    z-index: 2

bd-1px($color, $arc)
  bf(0, 0, 100%, 100%, 1px, $color, $arc)

bdt-1px($color)
  position: relative
  &:before
    content: ''
    position: absolute
    top: 0
    border-bottom: 1px solid $color
    display: block
    width: 100%
bdb-1px($color)
  position: relative
  &:before
    content: ''
    position: absolute
    bottom: 0
    border-bottom: 1px solid $color
    display: block
    width: 100%
bdr-1px($color)
  position: relative
  &:before
    content: ''
    position: absolute
    right: 0
    top: 20%
    border-right: 1px solid $color
    display: block
    height: 60%

trangel-top($size, $color)
  position: relative
  &:before
    content: ''
    border: $size solid $color
    border-color: transparent transparent $color transparent
    position: absolute
    left: 50%
    bottom: -1px
    transform: translateX(-50%)

trangle-right($width, $color)
  &:before, &:after
    content: ''
    position: absolute
    top: 50%
    width: 0
    height: 0
    border: $width solid transparent
    transform: translateY(-50%)
  &:before
    right: -9px
  &:after
    border-color: transparent transparent transparent $color
    right: -10px

trangle-bottom($width, $color)
  &:before, &:after
    content: ''
    position: absolute
    left: 50%
    width: 0
    height: 0
    border: $width solid transparent
    transform: translateX(-50%)
  &:before
    bottom: -18px
  &:after
    border-color: $color transparent transparent transparent
    bottom: -20px

